<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>健康管家</title>
    <link rel="stylesheet" type="text/css" href="iconfonts/iconfont.css">
    <link href="public/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="public/css/style.css">
    <link rel="stylesheet" href="public/css/styles.css">
</head>
<body style="background: #f8f8f8">
    <header>
        <i class="iconfont icon-18zhuye color1 font"></i>
        <span class="font">墨子星健康管家</span>
    </header>
    <section>
        <div class="bg"><img src="public/img/bg1.png" alt="背景图片"></div>
        <div class="row section-header" >
            <div class="col-xs-6 col" style="padding-left: 5%;">
                <i class="iconfont icon-14rentou"></i>
                <span class="font-2 name">周雄</span>
                <span>(父亲)</span>
                 <span style="background: #808080;height: 15px;line-height: 15px;border-radius: 8px;">58岁</span>
            </div>
            <div class="col-xs-6 col">
                <i class="iconfont icon-zuobiao"></i>
                <span class="zuobiao">广州市番属区</span>
                <span style="background: #4178c6;height: 20px;line-height: 20px;border-radius: 5px;color: white;font-size: 14px">
                    <i class="iconfont icon-qiehuan font"></i>切换
                </span>
            </div>
        </div>
        <div class="section-warning">
            <div class="title" style="padding-left: 2%;">
                <i class="iconfont icon-yujingxinxi font-2"></i>
                <span style="font-weight: bold;font-size: 20px">预警信息</span>
            </div>
            <div class=" indicator" style="padding-left: 5%">
                <i class="iconfont icon-zhengque1"></i>
                <span style="font-size:18px;">所有指标正常</span>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-12 col" style="padding-left:2%;padding-top: 5%">
                <i class="iconfont icon-jiankang"></i>
                <span style="font-weight: bold;font-size: 20px">健康概况</span>
            </div>

        </div>
        <div class="row">
            <div class="col-xs-5 col" style="padding-left:2%;padding-top:2%;">
                <i class="iconfont icon-xieyatongzhi xueya-health" style="color:#84b646;line-height: 0 "></i>
                <span class="font-3">血压:120/78mmHg</span>
            </div>
            <div class="col-xs-4 col" style="padding-top:2%;">
                <i class="iconfont icon-xinshuai" style="font-size: 12px;color: white;background:#84b646;width: 16px;height: 16px;border-radius:16px;line-height: 16px;text-align: center"></i>
                <span class="font-3">心率:60/min</span>
            </div>
            <div class="col-xs-3 col" style="padding-top:2%;">
                <i class="iconfont icon-tiwen color3 tiwen-health" style="line-height: 0"></i>
                <span class="font-3">体温:37℃</span>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-5 col" style="padding-left:2%;padding-top:2%;">
                <i class="iconfont icon-xieyangtixing xueyang-health" style="color:#84b646 "></i>
                <span class="font-3">血氧:98%</span>
            </div>
            <div class="col-xs-4 col" style="padding-top:3%;">
                <i class="iconfont icon-huxineike" style="color:#84b646 "></i>
                <span class="font-3">呼吸:70/min</span>
            </div>
            <div class="col-xs-3 col" style="padding-top:2%;">
                <i class="iconfont icon-shuimian shuimian-health" style="color:#84b646 "></i>
                <span class="font-3">睡眠:8.5h</span>
            </div>
        </div>
    </section>
    <footer class="footer-health">
        <div class="row">
            <div class="col-xs-3 col" style="padding-left: 2%;text-align: center;margin-top: 10px" >
                <i class="iconfont icon-zhuye font-6" style="color:#4178c6 "></i>
                <div style="margin-top: -6px;color: #4178c6">主页</div>
            </div>
            <div class="col-xs-3 col"  style="text-align: center;margin-top: 10px">
                <i class="iconfont icon-icon font-6" style="color: #5e5e5e"></i>
                <div style="margin-top: -8px;">监测</div>
            </div>
            <div class="col-xs-3 col" style="text-align: center;margin-top: 10px">
                <i class="iconfont icon-news font-6"></i>
                <div style="margin-top: -2px;">资讯</div>
            </div>
            <div class="col-xs-3 col" style="text-align: center;margin-top: 10px">
                <i class="iconfont icon-shezhi font-6" style="text-align: center"></i>
                <div style="margin-top: -6px;">设置</div>
            </div>
        </div>
    </footer>
</body>
<script src="public/js/jquery-1.11.1.min.js"></script>
<script src="public/js/bootstrap.min.js"></script>
<!--[if lt IE 9]>
<script src="public/js/html5shiv.js"></script>
<script src="public/js/respond.min.js"></script>
<![endif]-->
</html>
